<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../../css/index.css" />
<link rel="stylesheet" type="text/css" href="../../js/myPagination/page.css" />
<link rel="stylesheet" type="text/css" href="../../jeasyui/themes/gray/easyui.css" />
<link rel="stylesheet" type="text/css" href="../../jeasyui/themes/icon.css" />


<script type="text/javascript" src="../../jeasyui/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../../js/myPagination/jquery.myPagination6.0.js"></script>
<script type="text/javascript" src="../../js/jquery-jtemplates.js"></script>
<script type="text/javascript" src="../../js/common.js"></script>
<script type="text/javascript" src="../../jeasyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jeasyui/locale/easyui-lang-zh_CN.js"></script>
<title>主页</title>
<style type="text/css">
	.onePrayer{
		border-bottom: 1px solid #EFF0F1;
		margin-bottom: 10px;
	}
	.onePrayer .content{
	}
	.onePrayer .opt{
		margin: 0;
		padding: 0;
		text-align: right;
		padding-right: 5px;
		color: #666;
	}
	.onePrayer .opt .status{
		color: green;
	}
	.onePrayer img{
		border:none;
		padding:0;
		vertical-align: bottom;
	}
	.onePrayer .scope{
		color: #999;
	}
</style>
<script type="text/javascript">
var page;

function writePrayer(){
	var content = $("#prayerContent").val();
	if($.trim(content) != ""){
		var type = $("#prayerType").val();
		$.post("prayer.do", {method:"add",scope:type,content:content}, function(data){
			if(data == "success"){
				page.onReload();
				$("#prayerContent").val("");
			}
		});
	}
}

function queryMyPrayers(){
	page = initPagination({'pageId':'pageDiv', 
					'url' : 'prayer.do?method=findUserPrayers', 
					'callback':function(data){
						$("#myPrayers").setTemplateElement("tpl-prayers",null, {filter_data:false});
						$("#myPrayers").processTemplate(data.rows);
					}});
}

function deletePrayer(id){
	confirmDo('删除提示','您确定删除该代祷事项吗？', function(){
		$.post("prayer.do",{id:id, method:"deletePrayer"}, function(){
			page.onReload();
		});
	});
}

function setOver(id){
	$.post("prayer.do",{id:id,status:2, method:"setPrayerStatus"}, function(){
		page.onReload();
	});
}

function setContinue(id){
	$.post("prayer.do",{id:id,status:1, method:"setPrayerStatus"}, function(){
		page.onReload();
	});
}
	
	$(function(){
		queryMyPrayers();
	});
</script>
</head>

<body>
<!-- wrap starts here -->
<div id="wrap">
		
		<!--header -->
		<div id="header">			
				
			<h1 id="logo-text"><a href="#">Siloam</a></h1>		
			<p id="slogan">Here am I. Send me!</p>		
			
			<div id="header-links">
			<p>
				<a href="index.html">后台</a> | 
				<a href="index.html">退出</a>			
			</p>		
		</div>		
						
		</div>
		
		<!-- menu -->	
		<div  id="menu">
			<ul>
				<li ><a href="#">首页</a></li>
				<li><a href="#">团契介绍</a></li>
				<li><a href="#">联系我们</a></li>
				<li id="current"><a href="#">个人中心</a></li>
			</ul>
		</div>					
			
		<!-- content-wrap starts here -->
		<div id="content-wrap">
				
			<div id="sidebar">
			
				<h3>功能列表</h3>
				<ul class="sidemenu">				
					<li><a href="#">团契动态</a></li>
					<li><a href="#">我的代祷</a></li>
					<li><a href="#">我的文章</a></li>
					<li><a href="#">我的小组</a></li>
					<li><a href="#" title="Web Templates">密码修改</a></li>
				</ul>
								
			</div>
				
			<div id="main">
				<div id="writePrayer">
					<textarea style="width: 530px;height: 50px;border-color: #CCC" 
						id="prayerContent"></textarea>
					<div style="text-align: right;margin: 10px 0">
					<select id="prayerType" class="easyui-combobox"  
							data-options="panelHeight:'auto'">
						<option value="1">小组可见</option>
						<option value="2">所有人可见</option>
					</select>&nbsp;&nbsp;
					<input type="button" class="button" value="发布" onclick="writePrayer()"/>
					</div>
				</div>
				<h2>我的代祷</h2>
				<div id="myPrayers">
				</div>
				<div id="pageDiv"></div>
			</div>
		
		<!-- content-wrap ends here -->	
		</div>
					
		<!--footer starts here-->
		<div id="footer">
            <p>&copy; 2013 <strong>copyright siloam</strong>
   	    </p>
				
		</div>	

<!-- wrap ends here -->
</div>

<!-- 模版 -->
<p style="display: none">
  		
<!-- 评论模版 -->
<textarea id="tpl-prayers" rows="0" cols="0">
<!--
{#foreach $T as row}
<div class="onePrayer">
	<p class="content">
		{#if $T.row.status == "代祷中"} 
			<img src="../../img/ing.png" title="代祷中"/>
		{#else}
			<img src="../../img/end.png" title="结束"/>
		{#/if}
		{$T.row.content}
		<span class="scope">[{$T.row.scope}]</span></p>
	<p class="opt">
		<span>{$T.row.writeTime}</span>
		{#if $T.row.status == "代祷中"} 
		<a href="javascript:setOver({$T.row.id})">结束</a>
		{#else}
		<a href="javascript:setContinue({$T.row.id})">继续</a>
		{#/if}
		<a href="javascript:deletePrayer({$T.row.id})">删除</a>
	</p>
</div>
 {#/for}
-->
</textarea>
 		
</p>

</body>
</html>
